<template>
  <div class="login">
    <img class="logo" src="../assets/logo.png" alt="" />
    <input type="text" v-model="userName" placeholder="请输入用户名" />
    <input type="password" v-model="password" placeholder="请输入密码" />
    <button @click="loginHandle">登录</button>
    <router-link :to="{name:'Reg'}">没有账号我要注册</router-link>
    
  </div>
</template>
<script>
import { post } from "../utils/request";
export default {
  name: "Reg",
  data() {
    return {
      userName: "",
      password: "",
    };
  },
  methods: {
    changePage() {
      this.$eventBus.$emit("pagechange", "Reg");
    },
    loginHandle() {
      post("/api/v1/auth/login", {
        userName: this.userName,
        password: this.password,
      }).then((res) => {
        if (res.code === "success") {
          sessionStorage.setItem("token", res.token);
          // alert("注册成功");
          this.$router.push({
              name:'Home'
            })
          this.$eventBus.$emit("pagechange", "User");
        } else {
          alert(res.message);
        }
      });
    },
  },
};
</script>

<style scoped>
.login {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.login .logo {
  width: 70%;
}
.login input {
  padding: 0.6rem 0rem;
  width: 80%;
  margin: 0.5rem;
}
.login button {
  background-color: deeppink;
  padding: 0.8rem 1.8rem;
  color: white;
  width: 80%;
  border: none;
}
</style>
